<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>田振源</title>
  <link rel="shortcut icon" href="./img/logo/html-logo.png" />
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <link rel="stylesheet" href="css/common.css">
  <link rel="stylesheet" href="css/index.css">
</head>

<body>
  <nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
          aria-expanded="false" aria-controls="navbar">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">
          我们的爱情
        </a>
      </div>
      <div id="navbar" class="collapse navbar-collapse">
        <ul class="nav navbar-nav navbar-right">
          <li class="active"><a href="index.html">依菲</a></li>
          <li><a href="we-used.html">你说我的眼睛灿若星辰，那是因为你是星辰，而我的眼中只有你。</a></li>
        </ul>
      </div>
    </div>
  </nav>
  <!--导航条-->
  <div class="cover">
    <h1 class="cover-title title-top title1">人生是花</h1>
    <h1 class="cover-title title-bottom title2">而爱是花蜜</h1>
  </div>
  <!--cover-->
  <div class="container-fluid">
    <div class="row">
      <h1>阳光在每个裂缝中散落</h1>
      <div class="col-md-5 col-md-offset-1">
        <img class="logo-s logo1" src="img/logo/html-logo.png" alt="">
      </div>
      <div class="col-md-5">
        <div class="word word1">
          <h2 class="html">左手牵你</h2>
          <p>等老了，和爱人一起，找一个小镇，安静的住下，早上在巷口看日出，晚上相依相偎看夕阳。</p>
          <div class="blue-board">

          </div>
          <div class="learn-go">
            <h4>右手写爱</h4>
            <a class="btn btn3" href="#">mua</a>
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-5 col-md-offset-1">
        <img class="logo-s logo2" src="img/logo/css-logo.png" alt="">
      </div>
      <div class="col-md-5">
        <div class="word word2">
          <h2 class="css">山重水复疑无路</h2>
          <p>愿以一朵花的姿态行走世间，看得清世间繁杂却不在心中留下痕迹。花开成景，花落成诗。</p>
          <div class="blue-board">

          </div>
          <div class="learn-go">
            <h4>柳暗花明又一村</h4>
            <a class="btn btn3" href="#">mua</a>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-5 col-md-offset-1">
        <div class="word word3">
          <h2 class="js">雨是风的痕迹</h2>
          <p>传说，鱼的记忆只有七秒，如果真的是那样，我愿是只鱼，频繁的记住你，再恍惚的忘记你。</p>
          <div class="blue-board">

          </div>
          <div class="learn-go">
            <h4>风是雨的信息</h4>
            <a class="btn btn3" href="#">mua</a>
          </div>
        </div>
      </div>
      <div class="col-md-5">
        <img class="logo-r logo3" src="./img/logo/js.jpg" alt="">
      </div>
    </div>
    <div class="row">
      <div class="col-md-5 col-md-offset-1">
        <div class="word word4">
          <h2 class="boot">与你缠绵的每一秒</h2>
          <p>一缕阳光、一叶清风、一种情怀、一场播种、一把泥土溢出惬意，鸟语花香般恬暖……</p>
          <div class="blue-board">

          </div>
          <div class="learn-go">
            <h4>都是我生命里的永远</h4>
            <a class="btn btn3" href="#">mua</a>
          </div>
        </div>
      </div>
      <div class="col-md-5">
        <img class="logo-r logo4" src="img/logo/bootstrap-logo.png" alt="">
      </div>
    </div>
    <div class="row">
      <div class="col-md-12 recommend">
        <h3 class="learn-web">一笑万古春，一啼万古愁，此景非你莫有，此貌非你莫属。</h3>
        <a class="btn learn-web" href="#">mua</a>
      </div>
    </div>
    <!--前端技能简介-->
    <div class="design">
      <h2 class="title-top title3">普罗旺斯的薰衣草，就像幸福一样，只开一季。</h2>
      <h1 class="title-bottom title4">一个花开的季节，用向日葵来温暖眼瞳。</h1>
    </div>
    <div class="design-logo">
      <img src="img/design.png" alt="">
    </div>
    <div class="row">
      <div class="col-md-12">
        <h2 class="design-title">一闪一闪亮晶晶<br /><br />唱的都是我爱你</h2>
        <div class="ring-out">
          <div class="ring-back">
            <div class="c1-back">

            </div>
            <div class="c2-back">

            </div>
            <div class="c3-back">

            </div>
          </div>
          <div class="ring">
            <div class="circle c1">
              <span>相爱</span>
            </div>
            <div class="circle c2">
              <span>相知</span>
            </div>
            <div class="circle c3">
              <span>相守</span>
            </div>
            <div class="txt">
              <h3> 作为老公</h3>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-6">
        <h3 class="design-btn-a">人一简单就快乐，一世故就变老。保持一颗年轻的心，做个简单的人，享受阳光和温暖。生活就应当如此。</h3>
        <a class="btn  design-btn design-btn-a" href="">mua</a>
      </div>
      <div class="col-md-6">
        <h3 class="design-btn-a">我喜欢你，只是一个现在；我爱你，却是一整个未来,褪尽风华，我依然在彼岸守护你,随你走在天际，看繁花满地。</h3>
        <a class="btn  design-btn design-btn-a" href="">mua</a>
      </div>
    </div>
    <!--前端设计-->
    <div class="row works">
    </div>
    <div class="row works2">
      <h2>我愿做一片云，替你抵挡烈日。</h2>
    </div>
    <div class="row">
      <div class="col-md-3 col-md-offset-1 left-word">
        <ul>
          <h2>唱一首歌.想一个人</h2><br />
          <li>缘分带着几许浪漫，带着朦胧的淡淡的美，似在天边，又有近如咫尺的感觉。缘来，心中那一片光阴，如阳春三月的春天，明媚灿烂着心扉。我们的心还要记得，缘去，一如一蓑烟雨任平生的从容，许自己一片安静的天空。</li><br />
          <hr>
        </ul>
      </div>
      <div class="col-md-6 col-md-offset-2 page">
        <h3>相濡以沫，执子之手偕老。</h3>
        <img src="img/works.png" alt="">
        <a class="btn btn2" href="#">mua</a>
      </div>
    </div>
    <!--作品展示-->
    <div class="row">
      <div class="join-us">
        <h2>是否心动了呢?</h2>
        <img class="join-pointer" src="img/joinus-logo.png" alt="">
      </div>
    </div>
    <div class="row">
      <div class="col-md-4">
        <div class="step1 step">
          <div class="join-con">
            <div class="start start1">
              <span>one</span>
            </div>
            <div>

            </div>
            <div class="join-txt join-txt22">
              <p></p>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-4">
        <div class="step2 step">
          <div class="join-con">
            <div class="start start2">
              <span>two</span>
            </div>
            <div>

            </div>
            <div class="join-txt join-txt22">
              <p></p>
            </div>
          </div>

        </div>
      </div>
      <div class="col-md-4">
        <div class="step3 step">
          <div class="join-con">
            <div class="start start3">
              <span>three</span>
            </div>
            <div class="txt-head txt-head3">

            </div>
            <div class="join-txt join-txt22">
              <p></p>
            </div>
          </div>

        </div>
      </div>
    </div>

  </div>

  <div class="footer">
    <div class="container">
      振源和依菲
    </div>
  </div>
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <script type="text/javascript" src="js/bootstrap.min.js"></script>
  <script type="text/javascript" src="js/script.js"></script>
</body>

</html>